<template>
    <el-card shadow="never" style="max-height: 700px; overflow: auto">
        <el-form ref="form" :model="form" :rules="rules" label-width="90px" :disabled="disabled">
            <el-form-item label="id:" prop="id" v-show="false">
                <el-input v-model="form.id" disabled />
            </el-form-item>
            <!-- <el-form-item label="店铺名称:" prop="site_name">
                <el-input v-model="form.site_name" disabled></el-input>
            </el-form-item> -->
            <el-form-item label="开始时间:" prop="post_start_time">
                <el-date-picker v-model="form.post_start_time" type="date" value-format="yyyy-MM-dd HH:mm:ss" disabled/>
            </el-form-item>
            <el-form-item label="结束时间:" prop="post_end_time">
                <el-date-picker v-model="form.post_end_time" type="date" value-format="yyyy-MM-dd HH:mm:ss" disabled/>
            </el-form-item>
            <el-form-item>
                <!-- <el-button type="primary" @click="submitForm">确认 </el-button> -->
                <el-button type="warning" @click="cancel">返回 </el-button>
            </el-form-item>


            <el-card shadow="always" body-style="padding:0 20px;" v-loading="loading" >
            <el-divider class="mt5 mb5" />
            <el-row>
                    <div>订单明细</div>
                    <el-divider class="mt5 mb5" />
                    <template>
                        <el-table
                        :data="order_sales"
                        border
                        show-summary
                        :default-sort = "{prop: 'date', order: 'descending'}"
                        style="width: 100%">
                                <el-table-column
                                    prop="order_id"
                                    label="订单号"
                                    sortable>
                                </el-table-column>
                                <el-table-column
                                    prop="createtime"
                                    label="下单时间">
                                </el-table-column>
                                <el-table-column
                                    prop="status"
                                    label="订单状态">
                                </el-table-column>
                                <el-table-column
                                    prop="shipping_fee_platform_discount"
                                    sortable
                                    label="运费折扣$">
                                </el-table-column>
                                <el-table-column
                                    prop="total_amount"
                                    sortable
                                    label="销售额$">
                                </el-table-column>
                                <el-table-column
                                    prop="platform_discount"
                                    sortable
                                    label="平台折扣$">
                                </el-table-column>
                                <el-table-column
                                    prop="tax"
                                    sortable
                                    label="Taxes$">
                                </el-table-column>
                                <el-table-column
                                    prop="total_amounts"
                                    sortable
                                    label="最终销售额$">
                                </el-table-column>
                        </el-table>
                    </template>
            </el-row>
        </el-card>

        </el-form>
    </el-card>
</template>

<script>
export default {
name: 'EditForm',
props: {
    findFormData: {
        type: Object,
        default: {}
    },
    editFormParams: {
        type: Object,
        default: {}
    },
    // 表单是否禁用
    disabled: {
        type: Boolean,
        default: false,
    },
    
},
data() {
    return {
        sku_list:[],
        // 编辑表单验证规则
        rules: {
        },
        form: {  },
        order_sales: [],
        loading: false,

    }
},
watch: {
    findFormData: {
        handler(nval) {
            if (JSON.stringify(nval) != '{}') {
                this.$nextTick(() => {
                    this.form = nval,
                    this.order_sales = nval.order_sales
                })
            }
        },
        immediate: true,
        deep: false,
    },
    
},
methods: {
    // 取消按钮
    cancel() {
        this.$emit('editFormCancel')
    },

    submitForm() {
        this.$refs['form'].validate((valid, obj) => {
            if (valid) {
                this.$emit('submitForm', this.form)
            }
        })
    },

    // 表单重置
    reset() {
        this.resetForm('form')
    }
}
}
</script>
